import { Component, OnInit } from '@angular/core';
import { NzMessageService } from 'ng-zorro-antd';
import { DomSanitizer } from '@angular/platform-browser';
import { _HttpClient } from '@delon/theme';
import { environment } from '../../../../environments/environment';
declare const echarts: any;

@Component({
    selector: 'app-intelligenceanalysis',
    templateUrl: './intelligenceAnalysis.component.html',
    styleUrls: ['./intelligenceAnalysis.component.less']
})

export class IntelligenceAnalysisComponent implements OnInit {
    themeClass = 'whitetheme';
    iframe: any;
    kmsat = '<iframe src="/csmis/staht/kmsat.html?' + new Date().getTime() + '&theme=' + this.themeClass + '" frameborder="0" style="width:100%;height:620px;"></iframe>';
    alarmInfo = [];
    alarmClassList: any = [];
    alarmDevList: any = [];
    alarmDevCount = 0;
    color = ['#2B90F7', '#33DB7D', '#9277E8', '#FDBE13', '#2CD9C5', '#505D6F', '#F3953D', '#C0C0C0'];
    ws: WebSocket;

    constructor(
        public msg: NzMessageService,
        private http: _HttpClient,
        private sanitizer: DomSanitizer
    ) { }

    ngOnInit() {
        this.iframe = this.sanitizer.bypassSecurityTrustHtml(this.kmsat);
        this.alarmList();
        this.alarmClass();
        this.alarmDev();
        this.alarmTrend();
    }
    alarmList() {
        // 获取所有报警列表  
        this.http.get(environment.project + '/alarmTab2/query?czjy=1&notice=1&page=1&limit=100').subscribe((res: any) => {
            if (!res.code) {
                this.alarmInfo = res.data;
            }
        });
        setTimeout(() => {
            this.alarmList();
        }, 5000)
    }
    alarmClass() {
        this.http.get(environment.project + '/alarmTab2/staticYestodayByAlarmLevel').subscribe((res: any) => {
            if (!res.code) {
                const alarmClassData = [];
                for (let i = 0; i < res.data.length; i++) {
                    this.alarmClassList.push({
                        name: res.data[i].SUMTYPE,
                        value: res.data[i].SUMS,
                        color: this.color[i]
                    });
                }
                for (const item of res.data) {
                    alarmClassData.push({
                        name: item.SUMTYPE,
                        value: item.SUMS
                    });
                }
                echarts.init(document.getElementById('alarmClass')).setOption({
                    color: this.color,
                    tooltip: {
                        trigger: 'item',
                        formatter: '{a} <br/>{b} : {c} ({d}%)'
                    },
                    series: [
                        {
                            name: '报警类型',
                            type: 'pie',
                            radius: [0, 80],
                            center: ['25%', '40%'],
                            roseType: 'radius',
                            label: {
                                normal: {
                                    show: true
                                }
                            },
                            emphasis: {
                                label: {
                                    show: true
                                }
                            },
                            minAngle: 10,
                            data: alarmClassData
                        }
                    ]
                });
            };
        });
    }
    alarmDev() {
        // const res = { "msg": "Ok", "code": 0, "count": 0, "meta": null, "data": [{ "SUMTYPE": "其他", "SUMS": 1 }, { "SUMTYPE": "电源屏", "SUMS": 19 }] };

        this.http.get(environment.project + '/alarmTab2/staticYestodayByDevType').subscribe((res: any) => {
            if (!res.code) {
                const alarmDevData = [];
                for (let i = 0; i < res.data.length; i++) {
                    this.alarmDevList.push({
                        name: res.data[i].SUMTYPE,
                        value: res.data[i].SUMS,
                        color: this.color[i]
                    });
                    this.alarmDevCount += res.data[i].SUMS;
                }
                for (const item of res.data) {
                    alarmDevData.push({
                        name: item.SUMTYPE,
                        value: item.SUMS
                    });
                }
                echarts.init(document.getElementById('alarmDev')).setOption({
                    color: this.color,
                    tooltip: {
                        trigger: 'item',
                        formatter: '{a} <br/>{b}: {c} ({d}%)'
                    },
                    series: [
                        {
                            name: '访问来源',
                            type: 'pie',
                            radius: ['40%', '60%'],
                            center: ['25%', '40%'],
                            label: {
                                normal: {
                                    show: true
                                }
                            },
                            minAngle: 10,
                            data: alarmDevData
                        }
                    ]
                });
            }
        });
    }
    alarmTrend() {
        // const res = {
        //     "msg": "Ok", "code": 0, "count": 0, "meta": null, "data": [
        //         { "SIXDAYSUM": 0, "SEVENDAYSUM": 0, "YESTODAYSUM": 5, "FIVEDAYSUM": 0, "ALARMLEVEL": 2, "FOURDAYSUM": 0, "THRIDDAYSUM": 0, "TOWDAYSUM": 6 },
        //         { "SIXDAYSUM": 0, "SEVENDAYSUM": 0, "YESTODAYSUM": 360, "FIVEDAYSUM": 0, "ALARMLEVEL": 4, "FOURDAYSUM": 0, "THRIDDAYSUM": 0, "TOWDAYSUM": 625 },
        //         { "SIXDAYSUM": 0, "SEVENDAYSUM": 0, "YESTODAYSUM": 4, "FIVEDAYSUM": 0, "ALARMLEVEL": 5, "FOURDAYSUM": 0, "THRIDDAYSUM": 0, "TOWDAYSUM": 6 },
        //         { "SIXDAYSUM": 0, "SEVENDAYSUM": 0, "YESTODAYSUM": 132, "FIVEDAYSUM": 0, "ALARMLEVEL": 3, "FOURDAYSUM": 0, "THRIDDAYSUM": 0, "TOWDAYSUM": 476 }]
        // };

        this.http.get(environment.project + '/alarmTab2/staticbylastsevenday').subscribe((res: any) => {
            if (!res.code) {
                const alarmTrendName = ['报警等级', '昨日', '第二天', '第三天', '第四天', '第五天', '第六天', '第七天'];
                const alarmTrendData = [];

                for (let i = 0; i < res.data.length; i++) {
                    alarmTrendData.push({
                        name: alarmTrendName[i],
                        type: 'bar',
                        stack: '数量',
                        label: {
                            normal: {
                                show: true,
                                position: 'inside'
                            }
                        },
                        barWidth: 35,
                        barMinHeight: 15,
                        data: [
                            res.data[i].ALARMLEVEL,
                            res.data[i].YESTODAYSUM,
                            res.data[i].TOWDAYSUM,
                            res.data[i].THRIDDAYSUM,
                            res.data[i].FOURDAYSUM,
                            res.data[i].FIVEDAYSUM,
                            res.data[i].SIXDAYSUM,
                            res.data[i].SEVENDAYSUM
                        ]
                    })
                }
                echarts.init(document.getElementById('alarmTrend')).setOption({
                    color: this.color,
                    // tooltip: {
                    //     trigger: 'axis',
                    //     axisPointer: {
                    //         type: 'shadow'
                    //     }
                    // },
                    grid: {
                        top: '3%',
                        left: '3%',
                        right: '2%',
                        bottom: '2%',
                        containLabel: true
                    },
                    xAxis: {
                        type: 'category',
                        data: alarmTrendName
                    },
                    yAxis: {
                        type: 'value'
                    },
                    series: alarmTrendData
                });
            }
        });
    }
    themeChenge(e) {
        this.themeClass = e;
    }
    alarmColor(data) {
        return { 'color': data.alarmlevel === 4 ? '#9277e8' : '#ff2d2d' };
    }
}
